<template>
  <div style="background:#f2f2f2;width:100%;height:100%;">
    <van-nav-bar title="盘点单管理" left-arrow @click-left="onClickLeft" />
    <div class="itembot">
      <div style="color:black">
        <router-link :to="{name: 'carryOn'}" style="color:#ccc">进行中</router-link>
      </div>
      <div style="color:blue">已结束</div>
    </div>
    <div class="list">
      <div class="list-item" v-for="(item,index) in option1" :key="index">
        <div class="itemtop">
          <div class="topright">
            <div class="top">
              <div>{{item.NAME }}
              </div>
              <div>盘点人数:{{item.NUM}}</div>
            </div>
            <div style="height:30px ;margin-top:10px ;">
              <div>已完成</div>
              <div>未完成</div>
            </div>
            <div style="height:19px;">
              <div>{{ item.COMPLETENUM }}
              </div>
              <div>
                {{ item.TODONUM }}</div>
            </div>
          </div>
        </div>
        <div class="bottom">
          <div>
            创建时间:{{ getExactTime(item.CREATEDATE)}}
            </div>
          <div>完成时间:{{getExactTime(item.DATE)}}</div>
        </div>
      </div>
    </div>
    <van-button color="linear-gradient(to right, #8186f5, #5d98fd)" @click="addForm" icon="add-o" size="large">
  创建盘点单
</van-button>
  </div>
</template>

<script>
import awsuiAxios from '../awsuiAxios';

export default {
  data() {
    return {
      option1: ''
    }
  },
  methods: {
    getExactTime(time) {
      if(time==undefined){
        return "---"
      }
        var date = new Date(time);
        // var date = new Date(time* 1000);
        var year = date.getFullYear() + '-';
        var month = (date.getMonth()+1 < 10 ? '0' + (date.getMonth()+1) : date.getMonth()+1) + '-';
        var dates = date.getDate() + ' ';
        
        return year + month + dates ;
 },
    onClickLeft() {
      this.$router.push('/')
     },
    addForm() {
      // alert('你好啊')
       this.$router.push("/createsheet")
    }
  },
  mounted() {
    const that = this;
    awsuiAxios.post({
      url: 'jd',
      data: {
        // cmd: "com.awspaas.user.apps.assetinventory_selectCompany",
        cmd: "com.awspaas.user.apps.assetinventory_selectTask",
        sid: sid,
        flag: 1
      }
    }).then(function (ro) {
      if (ro.result == 'ok') {
        // that.message = ro.data.staffList
        // that.$router.push({path:'/show',query:{data:ro.data.staffList}})
        console.log(ro);
        that.option1 = ro.data.task

      } else {
        // Toast.fail('扫码失败：' + ro.msg);
      }
    }).catch(error => {
      console.log(error);
    })
  }
}
</script>
<style scoped>
.topmes {
  width: 100%;
  height: 150px;
  background: #cccccc;
  padding-top: 10px;
  position: relative;
}
.itembot {
  display: flex;
  background: white;
}
.itembot div {
  width: 50%;
  text-align: center;
  height: 40px;
  line-height: 40px;
  color: #cccccc;
  padding: 2px 0;
  font-weight: bold;
}
.list {
  margin-top: 9px;
  width: 100%;
  height: 500px;
  background: #f2f2f2;
  overflow-y: scroll;
}
.list-item {
  width: 100%;
  margin-top: 10px;
  height: 120px;
  background: white;
}
.itemtop {
  display: flex;
  border-bottom: 1px solid #ccc;
}
.top {
  display: flex;
  width: 100%;
  height: 30px;
  align-content: center;
  border-bottom: 1px solid #ccc;
}
.topright {
  justify-content: space-around;
  padding: 4px 0 4px 0;
  width: 100%;
}

.topright div {
  display: flex;
  justify-content: space-around;
  font-size: 13px;
}
.bottom {
  display: flex;
  justify-content: space-around;
}
.button {
  position: relative;
  width: 250px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  margin-top: 20px;
  margin-left: 60px;
  background-color: skyblue;
}
::v-deep .van-button{
  position: fixed;
  bottom: 0px;
}
</style>